<template>
  <div>
    <el-dialog title="会员设置编辑" :visible.sync="showEditPageDialog" center width="770px">
      <div class="viptime">
        <div style="float:left;margin-left:230px;">会员有效期：</div>
        <input style="float:left;height: 23px;width: 50px;margin-right:20px;" v-model="pageData.validity_period">
        <div>天</div>
      </div>
      <div class="vipprice">
        <div style="float:left;margin-left:290px">原价：</div>
        <input style="float:left;height: 23px;width: 50px;margin-right:20px;" v-model="pageData.price">
        <div>元</div>
      </div>
      <div class="vipcheap">
        <div style="float:left;margin-left:197px">特惠价(支付价)：</div>
        <input style="float:left;height: 23px;width: 50px;margin-right:20px;" v-model="pageData.discount_price">
        <div>元</div>
      </div>
      <el-button type="danger" style="margin-left:200px;" @click="cancel()">取消保存</el-button>
      <el-button type="primary" style="margin-left:100px;" @click="confirm">确定保存</el-button>
    </el-dialog>
    
    <el-dialog title="再次确认" :visible.sync="saveEditDialog" center width="770px">
      <div class="viptime">
        <div style="float:left;margin-left:230px;">会员有效期：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.validity_period}}</span>
        <div>天</div>
      </div>
      <div class="vipprice">
        <div style="float:left;margin-left:290px">原价：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.price}}</span>
        <div>元</div>
      </div>
      <div class="vipcheap">
        <div style="float:left;margin-left:197px">特惠价(支付价)：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.discount_price}}</span>
        <div>元</div>
      </div>
      <el-button type="danger" style="margin-left:200px;" @click="Checkcancel()">取消保存</el-button>
      <el-button type="primary" style="margin-left:100px;" @click="save">确定保存</el-button>
    </el-dialog>

    <el-dialog title="保存成功" :visible.sync="affirmEditDialog" center width="770px">
      <div class="viptime">
        <div style="float:left;margin-left:230px;">会员有效期：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.validity_period}}</span>
        <div>天</div>
      </div>
      <div class="vipprice">
        <div style="float:left;margin-left:290px">原价：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.price}}</span>
        <div>元</div>
      </div>
      <div class="vipcheap">
        <div style="float:left;margin-left:197px">特惠价(支付价)：</div>
        <span style="float:left;height: 23px;width: 50px;margin-right:20px;">{{pageData.discount_price}}</span>
        <div>元</div>
      </div>
      <el-button type="primary" style="margin-left:300px;" @click="affirm">确定</el-button>
    </el-dialog>
  </div>
</template>
<script>
import {edit,getList} from '@/api/thk/cms/member'
export default {
  data(){
    return{
       showEditPageDialog: false,
       saveEditDialog:false,
       affirmEditDialog:false, 
       pageData:{
         id:'',
         validity_period:'',
         price:'',
         discount_price:''
       },
       verify:{
         validity_period:'',
         price:'',
         discount_price:''
       }
    }
  },
  inject: ['reload'],
  methods:{
    handleEdit(row){
      this.showEditPageDialog = true
    },
    confirm(){
      this.saveEditDialog = !this.saveEditDialog
    },
    cancel(){
      this.showEditPageDialog = false
      this.saveEditDialog = false
    },
    Checkcancel(){
      this.showEditPageDialog = true
      this.saveEditDialog = false
    },
    affirm(){
      this.showEditPageDialog = false
      this.saveEditDialog = false
      this.affirmEditDialog = false
      this.reload()
    },

    save(){
      var array = {
        id:this.pageData.id,
        validate: this.pageData.validity_period,
        validity_period: this.pageData.validity_period,
        price: this.pageData.price,
        discount_price: this.pageData.discount_price
      }
      console.log(array,"999999999999")
      edit(this.$store.getters.token, array).then(res =>{

        },error => {
          console.log(error)
        })
      this.replace
      this.affirmEditDialog = true
      console.log(this.pageData,'pageData')
      console.log(array,'array')
    },

    replace(){
      // console.log(row,'showEditDialog')
      //   this.pageData.id= row.id
      //   this.pageData.validity_period = row.validity_period
      //   this.pageData.price = row.price
      //   this.pageData.discount_price = row.discount_price
      //   this.showEditPageDialog = !this.showEditPageDialog
      getList(this.$store.getters.token).then(res =>{
          this.pageData = res.data.list.data
        },error => {
          console.log(error)
        })
    },

    showEditDialog(row){
        console.log(row,'showEditDialog')
        this.pageData.id= row.id
        this.pageData.validity_period = row.validity_period
        this.pageData.price = row.price
        this.pageData.discount_price = row.discount_price
        this.showEditPageDialog = !this.showEditPageDialog
    },
    // saveEditDialog(row){
    //     console.log(row,'EditDialog')
    //     this.verify.validity_period = row.validity_period
    //     this.verify.price = row.price
    //     this.verify.discount_price = row.discount_price
    //     this.saveEditDialog = !this.saveEditDialog
    // },
    // affirmEditDialog(row){
    //     console.log(row,'Dialog')
    //     this.affirmEditDialog = !this.affirmEditDialog
    // },
  }
}
</script>
<style>
.viptime{
  font-size: 20px;
  margin-bottom: 30px;
}
.vipprice{
  font-size: 20px;
  margin-bottom: 30px;
}
.vipcheap{
  font-size: 20px;
  margin-bottom: 30px;
}
</style>